<template>
	<view class="breadcrumb">
		<view class="item" v-for="(p,i) in paths" :key="i">
			<template v-if="i<paths.length-1">
				<navigator :url="p.url" :open-type="p.openType">{{p.title}}</navigator>
				<text class="separator">&gt;</text>
			</template>
			<text v-else>{{p.title}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		name: "xzBreadcrumb",
		props: {
			paths: { //属性名
				typeo: Array, //属性值得类型
				required: true, //该属性是不是必须出现的
			}
		},
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss">
	.breadcrumb {
		//修改弹性容器的主轴方向:横向
		flex-direction: row;
		padding: $uni-spacing-col-base $uni-spacing-row-base;

		.item {
			flex-direction: row;

			.separator {
				margin: 0 $uni-spacing-row-sm;
			}
		}
	}
</style>
